<div class="col-9">
  <input type="button" value="隐藏/显示" (click)="onToggle()">
<div class="form-group form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1"></label>
</div>
<div  class="row">
  <div class="col-3">
    <ul *ngIf="shouldShow"class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
      <li *ngFor='let menu of menus' [ngClass]="{active:menu.active}" (click)="onMenuClicked(menu)" class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab" aria-controls="v-pills-home" >{{menu.name}}</li>
    </ul>
  </div>
  
    <div class="tab-content" id="v-pills-tabContent">
      <div class="tab-pane fade show active" id="v-pills-home" role="tabpanel" aria-labelledby="v-pills-home-tab">11111111111111111111111</div>
      <div class="tab-pane fade" id="v-pills-profile" role="tabpanel" aria-labelledby="v-pills-profile-tab">222222222222222222</div>
      <div class="tab-pane fade" id="v-pills-messages" role="tabpanel" aria-labelledby="v-pills-messages-tab">333333333333333/div>
      
    </div>
  </div>
 
</div>

